<template>
    <div>
        <section class="jumbotron">
            <h3 class="jumbotron-heading">Search Github Users</h3>
            <div>
                <input type="text" placeholder="enter the name you search" v-model="keyword"/>&nbsp;<button @click="search">Search</button>
            </div>
        </section>
    </div>
</template>

<script>
//引入axios
    import axios from 'axios'
export default {
  name: 'Search',
  data() {
    return {
      keyword: ''
    }
  },
  methods: {
    search() {
      this.$bus.$emit('updateListData', {isFirst:false, isLoading:true, errMsg:'', users:[]});
      axios.get(`https://api.github.com/search/users?q=${this.keyword}`).then(response => {
        console.log(response.data.itms);
        this.$bus.$emit('updateListData', {isLoading:false, errMsg:'', users:response.data.items});
      }, error => {
        console.log(error)
        this.$bus.$emit('updateListData', {isLoading:false, errMsg:error.message, users:[]});
      })
    }
  }

}
</script>

<style>

</style>